.qux-date-picker{
    border:1px solid #333;
    position: relative;

    .qux-common-placeholder{
        opacity: 0.7;
    }

    .qux-date-picker-icon {
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translateY(-50%) translateX(50%);
    }

    .qux-date-picker-expend {
        position: absolute;
        height: 100%;
        top: 0px;
        right: 0px;
        width: 40px;
    }

    .qux-date-picker-carret {
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
        border-top: 4px solid;
        display: inline-block;
        height: 0;
        margin-left: 2px;
        vertical-align: middle;
        width: 0;
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translateY(-50%) translateX(50%);
        cursor: pointer;
    }

    .qux-date-picker-popup{
        position: absolute;
        top: calc(100% + 1px);
        left: 0px;
        display: none;
        border:1px solid #333;
        width: 100%;
        height: 300px;
        max-width: 300px;
        max-height: 300px;
        z-index: 1000;
        background: #fff;

        .qux-date{
            height: 100%;
        }
    }

    .qux-date-picker-item {
        display: block;
        cursor: pointer;
    }

    &.qux-open .qux-date-picker-popup{
        display: block;
    }
}